
<template>
  <div class="zffs_box">
    <headercom></headercom>
    <div class="bcg">
      <div class="zffs">
        <ul>
          <li>
            <div class="gdg">
              <p class="gdg_bt">企业账号 公对公线下付款</p>
              <a-radio-group @change="onChange" v-model="gdvalue">
                <a-radio :value="1">开通</a-radio>
                <a-radio :value="0">关闭</a-radio>
              </a-radio-group>
            </div>

            <div class="dgxk">
              <div :class="gdvalue==0?'ccc':''"></div>
              <div>
                <a-textarea v-model="beizhu" class="text" name id cols="30" rows="10"></a-textarea>
              </div>
            </div>
          </li>
          <li class="tli">
            <div class="gdg">
              <p class="gdg_bt">微信收款</p>
              <a-radio-group @change="onChange" v-model="pcwxvalue">
                <a-radio :value="1">开通</a-radio>
                <a-radio :value="0">关闭</a-radio>
              </a-radio-group>
            </div>
            <div class="dgxk">
              <div :class="pcwxvalue==0?'ccc':''"></div>
              <ul>
                <li>
                  <span>
                    <i>*</i>商户ID：
                  </span>
                  <a-input v-model="shID" class="input" placeholder />
                </li>
                <li>
                  <span>
                    <i>*</i>商户密钥：
                  </span>
                  <a-input v-model="shmy" class="input" placeholder />
                </li>
              </ul>
            </div>
          </li>
          
        </ul>

        <div class="xj_btn">
          <a-button type="primary" @click="subbc" class="qx_btn">保存</a-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import qs from "qs";
import headercom from "../header-comm/header.vue";
export default {
  data() {
    return {
      gdvalue: 0,
      pcwxvalue: 0,
      wxgzhvalue: 2,
      shID: "",
      shmy: "",
      beizhu: "",
      wxid: "",
      qyid: "",

      zffsvalue: []
    };
  },
  methods: {
    onChange(e) {
      console.log("radio checked", e.target.value);
      this.gdvalue=e.target.value
    },

    getzffs() {
      this.axios
        .post(
          "set/PayMethod.php",
          qs.stringify({
            sqdwid: this.$store.state.bbl_sqdwid
          })
        )
        .then(res => {
        
          this.zffsvalue = res.data.result;
          this.beizhu = this.zffsvalue.qyAccount[0].beizhu;
          this.qyid = this.zffsvalue.qyAccount[0].qyid;
          this.shID = this.zffsvalue.wxAccount[0].mch_id;
          this.shmy = this.zffsvalue.wxAccount[0].wxkey;
          this.wxid = this.zffsvalue.wxAccount[0].wxid;
        });
    },
    subbc() {
      if (this.gdvalue == 1 || this.pcwxvalue == 1) {
        // if (this.shID || this.shmy != "") {
          this.axios
            .post(
              "set/SetPayMethod.php",
              qs.stringify({
                sqdwid: this.$store.state.bbl_sqdwid,
                gsmc: sessionStorage.getItem("dwmc"),
                qyIsOpen: this.gdvalue,
                qyid: this.qyid,
                qyBeiZhu: this.beizhu,
                wxIsOpen: this.pcwxvalue,
                wxid: this.wxid,
                mchId: this.shID,
                mchKey: this.shmy
              })
            )
            .then(res => {
              console.log(res);
              if (res.data.code == 303) {
                this.$notification["success"]({
                  message: "成功",
                  description: res.data.msg
                });
              }else{
                  this.$notification["error"]({
                  message: "失败",
                  description: res.data.msg
                });
              }
            });
        // } else {
        //   this.$notification["error"]({
        //     message: "失败",
        //     description: "请将所选支付内容填写完整"
        //   });
        // }
      } else {
        this.$notification["error"]({
          message: "失败",
          description: "请先点击开通一种支付方式"
        });
      }
    }
  },
  components: {
    headercom
  },
  created() {
    this.getzffs();
  }
};
</script>

<style lang='less'>
th.column-money,
td.column-money {
  text-align: right !important;
}

.zffs_box {
  width: 100%;
  .zffs {
    position: absolute;
    background-color: #fff;
    width: 98%;
    top: 70px;
    left: 1%;
    box-shadow: 0px 0px 7px #ccc;
    ul {
      display: flex;
      justify-content: space-between;
      width: 100%;
      .tli {
        border-left: 1px solid #6663;
      }
      li {
        width: 50%;
        .gdg {
          background-color: #f3f7f9;
          padding: 10px;
          .gdg_bt {
            font-size: 16px;
            float: left;
            margin: 0;
            text-align: left;
            width: 50%;
          }
        }
        .dgxk {
          position: relative;
          z-index: 9;
          width: 100%;
          .text {
            width: 90%;
            height: 200px;
            margin-top: 10px;
          }
          ul {
            padding: 40px 0;
            display: block;
            li {
              display: flex;
              align-items: center;
              width: 100%;
              margin: 20px 0;
              span {
                width: 120px;
                text-align: right;
                padding-right: 10px;
              }
              i {
                color: #ff0000;
                padding: 0 4px;
              }
            }
            .input {
              width: 40%;
            }
          }
        }
        .ccc {
          position: absolute;
          z-index: 99;
          width: 100%;
          height: 100%;
          background: rgba(255, 255, 255, 0.6);
        }
      }
    }

    .xj_btn {
      padding: 30px;
      .qx_btn {
        width: 90px;
        margin: 0 15px;
      }
    }
  }
}
</style>
